<!DOCTYPE html>
<html lang = "en">
<head>
    <meta charset = "UTF-8">
    <title>Title</title>

    <!--=====================================================================-->


    <script>
        //面向对象

        //=====================================================================
        //任何一个变量/对象都可以有一个自己的属性,即使未被定义
        let a = 12;
        console.log('a',a.a);   //undefined


        //如下例,b独立存在时会报错
        // console.log('b',b);      //b is not defined
        //当b定义为window下的一个属性(对象)时,该变量不再会报错
        console.log('b',window.b);  //undefined

        //=====================================================================
        //this的意义
        //假定定义一个arr1数组对象
        let arr1 = [1,2,3,4];
        arr1.show = function () {
            //this 就是 arr1,所谓this就是 属于当前的方法(环境)的对象
            console.log('arr1[0] === this[0]',this[0] === arr1[0]); //true
        };
        arr1.show();


        //es6下创建对象的正确方法
        class ArrayObj{
            constructor( ...args) {
                this.array = new Array(...args);
            }
            showAll(){
                console.log('show arr',this.array);
            }
        }

        let arrayObj = new ArrayObj(1,2,3,4,5);
        arrayObj.showAll();


        //this是个对象
        //this.prop就是这个对象调用了其下的属性
        //如果不知道this是谁,就想想当前的方法是谁在隐式调用



        //=====================================================================
        //关于prototype
        let array1 = [1,2,3];
        let array2 = [4,5,6];       //2者的效果是一样的,推荐←的写法

        //为arr添加一个sum的方法
        Array.prototype.sum = function () {
            let result = 0;
            for (let i = 0; i < this.length; i++) {
                result += this[i];
            }
            return result;
        };

        console.log('arr1 sum:',array1.sum());
        console.log('arr2 sum:',array2.sum());

        //可以理解为所有类(对象)下的prototype属性,额外挂上一个方法
        //自己封装的对象也可以挂上prototype属性,演示略
        //如果不使用prototype,每个通过构造方法创建的方法会不相同 === false,浪费资源


        //=====================================================================
        //js对象,json对象
        //比较混乱的定义
        //一般把这种叫json对象,安全符合json的格式
        let jsonObj = {
            "a":"a",
            "b":"b"
        };

        //这种叫js对象
        let jsObj = {
            a:'a',
            b:'b'
        };

        //使用上是完全一样的
        console.log(jsonObj.a === jsObj.a);    //true

        //=====================================================================
        //古生代js的继承
        //需要先原型再call一下,没必要记了跳过

        //=====================================================================
        //js中的系统对象
        //分为 本地对象 内置对象 宿主对象
        //内置对象类似于java中的static方法,不需要new的
        //本地就是非static,需要new
        //宿主对象则是由运行环境提供的对象,例如dom和bom



    </script>
</head>

<body>

<div>

</div>

</body>
</html>